<template>
	<el-container>
		
		<el-aside width="35%" >
			<img style="margin-top: 300px;" id="logo" src="../assets/logo.png"/>
			<div id="asidetxt">
				
				<p class="fontClass">
					I AM LiuWenHao
				</p>
			</div>
			<hr style="height:50px;border:none;border-top:5px solid #555555; margin-left: 1%; margin-right: 1%; margin-top: 10px;" />
			<p style="height: 30px; font-size: 4px; margin-top: -40px;">不会改Bug的不是好程序员</p>
			<div id="asidepic">
				<img class="pics" src="../img/csdn.png" @click="csdn"/>	
				<img class="pic" src="../img/weixin.png" @click="weixin"/>
				<img class="pic" src="../img/github.png" @click="github"/>
			</div>
		</el-aside>
		 <el-container>
		     <el-header height="30px">
				<ul style="width: 100%; font-size: 3px; margin-top: 5px; margin-left: -5%;">
					<li class="her_list" @click="start">首页</li>
					<li class="her_list">博客</li>
					<li class="her_list">教程</li>
					<li class="her_list" @click="aboutme">联系我</li>
					<li class="her_list" @click="gongju">工具</li>
				</ul>
			 </el-header>
		     <el-main>
				 <router-view></router-view>
			 </el-main>
		   </el-container>
	</el-container>
	

</template>

<script>
import wexin from"@/home/weixingongzonghao.vue"


export default {
  name: 'sele',
  components: {

	},
	data() {
	      return {
	        
			
	      };
	},
	methods:{
		confirm(){
			this.$router.push({path:"/aboutme"})
		},
		weixin(){
			this.$router.push({path:"/weixin"})
		},
		csdn(){
			this.$router.push({path:"/csdn"})
		},
		github(){
			this.$router.push({path:"/github"})
		},
		start(){
			this.$router.push({path:"/home"})
		},
		aboutme(){
			this.$router.push({path:"/aboutme"})
		},
		gongju(){
			this.$router.push({path:"/gongju"})
		}
	}

  }
  
</script>
	<style>
	*{
		margin: 0;
		padding: 0;
		height: 100%;	
		overflow: hidden;
	}	
	</style>
<style>
	
	.el-header{
	    background-color: #D3DCE6; 
		width: 100%;
		border:1px solid white;
		
	  }
	.el-main {
	    background-color: #E9EEF3;
	    color: #333;
		border:1px solid white;
		margin-left: -10%;
		font-size: 1px;
	  }
	.el-aside {
		overflow:hidden;
	    background-color: #D3DCE6;
	    color: #333;
		border:1px solid white;
	  }
	  #logo{
		  margin-top: 30%;
		  width: 100px;
		  height: 100px;	
		  margin-bottom: 10%;
	  }
	  #asidetxt{
		margin-top: -20px;
		font-family: 'Courier New', Courier, monospace;
		font-size: 20px;
		height: 50px;
	  }
	  .pics{
	  		 width: 30px;
	  		 height: 30px;
	  		overflow: hidden;  
	  }
	  .pic{
		 margin-left: 10px;
		 width: 30px;
		 height: 30px;
	  }
	  #rig{
		  margin-top: 10px;
		  height: 14%;
	  }
	.el-main {
	   overflow: hidden;
	}
	.xzmce-spot-root{
		overflow: hidden;
	}
	.her_list{
		list-style: none; 
		float: left;
		margin-left: 5%;
		margin-right: 5%;
		font-size: 5px;
	}
	.fontClass{
		font-size: 40px;
		height: 200px;
		margin-bottom: 100px;
	}
	
</style>
<style>
	.el-tabs__content {
    height: 1000%;
    width: 100%;

	}
</style> 	